<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>Bootstrap 101 Template</title>
    <!-- Bootstrap -->
    <link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="../css/font-awesome.min.css">
    <!--[if IE 7]>
      <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome-ie7.min.css">
    <![endif]-->
    <link rel="stylesheet" href="../css/base.css">
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="../vendor/bootstrap/js/html5shiv.min.js"></script>
      <script src="../vendor/bootstrap/js/respond.min.js"></script>
    <![endif]-->
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="../vendor/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="../vendor/bootstrap/js/bootstrap.min.js"></script>
    <script src="../vendor/avalon.js"></script>
    <script src="../js/main.js"></script>
</head>
<style>

</style>

<body ms-controller="index">
    <div class="head">
    <div class="main-container">
        <nav class="navbar">
            <div class="container-fluid">
                <div class="navbar-header">
                    <span>欢迎你，xxx公司</span>
                    <span>张慧敏</span>
                </div>
                <div class="nav navbar-nav navbar-right">
                    <span class="crumbs">设置</span>
                    <span class="crumbs-split">|</span>
                    <span class="crumbs message">
                            站内消息
                            <span class="message-num">5</span>
                    </span>
                    <span class="crumbs-split">|</span>
                    <span class="crumbs">退出</span>
                </div>
            </div>
        </nav>
    </div>
</div>
<div class="sn-nav" ms-controller="nav">
    <div class="main-container">
        <nav class="navbar">
            <div class="x ainer-fluid">
                <div class="navbar-header">
                    <a class="navbar-brand" href="#">
                        <img alt="logo" src="../images/logo.png">
                    </a>
                </div>
                <p class="navbar-text sn-nav-title">
                    人员流动配置
                </p>
                <p class="navbar-text sn-nav-menu" ms-repeat="navList">
                    <a ms-attr-href="el.PageUrl" ms-attr-id="el.ID">{{el.Name}}</a>
                </p>                
            </div>
        </nav>
    </div>
</div>
<script>
$(document).ready(function() {
    var nav = avalon.define({
        $id: "nav",
        navList: []
    });
    $.get(GetTopParentNode, function(data) {        
        if (data.Status == true) {
            console.log(data);
            nav.navList = data.Message;    
        }
    },'json');
});
</script>

    <div class="main-container">
        <div class="sub-nav">
            <nav class="navbar">
                <div class="container-fluid">
                    <div class="navbar-header">
                        <a class="navbar-brand" href="#">
                            <img alt="logo" src="" style="height:38px;border:0;">
                        </a>
                    </div>
                    <p class="navbar-text">
                        专项招聘
                    </p>
                    <p class="navbar-text crumbs-split">
                        >
                    </p>
                    <p class="navbar-text">
                        招聘人员范围
                    </p>
                </div>
            </nav>
        </div>
    </div>
    <div class="main-container">
        <ul class="ul-nav">
            <li ms-for="el in @menuList" class="ul-nav-li">
                <span>{{el.name}}</span>
                <ul>{{el.url}}</ul>
            </li>
        </ul>
    </div>
    <!-- <div class="footer">
        <div class="footer-nav">
            <div class="main-container">
                <span class="footer-crumbs">
                    <a href="#">首页</a>
                </span>
                <span class="crumbs-split">|</span>
                <span class="footer-crumbs">
                    <a href="#">公开招聘</a>
                </span>
                <span class="crumbs-split">|</span>
                <span class="footer-crumbs">
                    <a href="#">专项招聘</a>
                </span>
                <span class="crumbs-split">|</span>
                <span class="footer-crumbs">
                    <a href="#">柔性引才</a>
                </span>
                <span class="crumbs-split">|</span>
                <span class="footer-crumbs">
                    <a href="#">业务承揽</a>
                </span>
                <span class="crumbs-split">|</span>
                <span class="footer-crumbs">
                    <a href="#">意向人员库</a>
                </span>
            </div>
        </div>
        <div class=" footer-copyright">
            <div class="container">
                <span>Copy©2011&nbsp;中国石油化工集团版权所有</span>
                <span class="crumbs-split"></span>
                <span>监督举报邮箱(Email):
                <a href="mailto:job@sinopec.com">job@sinopec.com</a>
            </span>
            </div>
        </div>
    </div> -->
</body>
<script>
$(function() {
    var vm = avalon.define({
        $id: "index",
        menuList: [],
        test:'test'
    });
    console.log(vm.test)
    console.log(vm.$model.menuList)
    setTimeout(function(){
        vm.menuList = [{
            name: '1',
            num: '5',
            url: 'http://www.baidu.com1'
        }, {
            name: '2',
            num: '5',
            url: 'http://www.baidu.com2'
        }, {
            name: '3',
            num: '5',
            url: 'http://www.baidu.com3'
        }, {
            name: '4',
            num: '5',
            url: 'http://www.baidu.com4'
        }, {
            name: '5',
            num: '5',
            url: 'http://www.baidu.com5'
        }, {
            name: '6',
            num: '5',
            url: 'http://www.baidu.com6'
        }];
        console.log(vm.$model.menuList)
    },3000);
});
</script>

</html>
